<template>
    <div class="searchPatient">
        <navBar :titleName="titleName"></navBar>
        <search @messageData="getData" style="margin-top: 42px;" placeText="请输入病人姓名或手机号码"
                textInfo="查询"></search>
        <div class="patientlist">
            <div class="patient" v-for="(item,index) in patientList" :key="index" @click="goToRecord(item)">
                <nut-row style="min-height: 30px;padding-top: 10px;">
                    <nut-col :span="24">
                        <div class="flex-content" style="float: left;padding-left: 10px;font-size: 17px;">
                            {{item.patientName}}
                        </div>
                    </nut-col>
                </nut-row>
                <nut-row style="min-height: 30px;padding-top: 10px;">
                    <nut-col :span="3">
                        <div class="flex-content" style="float: left;padding-left: 10px;color: #999;">
                            {{item.patientGender | gender}}
                        </div>
                    </nut-col>
                    <nut-col :span="3">
                        <div class="flex-content flex-content-light"
                             style="float: left;padding-left: 10px;color: #999;">{{item.birth | age}}
                        </div>
                    </nut-col>
                    <nut-col :span="8">
                        <div class="flex-content flex-content-light"
                             style="float: left;padding-left: 10px;color: #999;">{{item.nation}}
                        </div>
                    </nut-col>
                    <nut-col :span="10">
                        <div class="flex-content" style="float: left;padding-left: 10px;color: #999;">{{item.addr}}
                        </div>
                    </nut-col>
                </nut-row>
            </div>
        </div>
    </div>
</template>

<script>
    /* eslint-disable no-console,no-unused-vars */

    import navBar from '@/components/common/navBar.vue'
    import search from '@/components/common/search.vue'

    export default {
        name: "searchPatient",
        components: {
            search,
            navBar
        },
        filters: {
            gender: function (gender) {
                if (gender === 1) {
                    return "男";
                } else if (gender === 2) {
                    return "女";
                } else {
                    return "";
                }
            },
            age: function (strBirthday) {
                if (strBirthday) {
                    let strBirthdayArr = strBirthday.split("-");
                    let d = new Date();
                    let yearDiff = d.getFullYear() - strBirthdayArr[0];
                    let monthDiff = d.getMonth() + 1 - strBirthdayArr[1];
                    let dayDiff = d.getDate() - strBirthdayArr[2];
                    let age = monthDiff < 0 || (monthDiff === 0 && dayDiff < 0) ? yearDiff - 1 : yearDiff;
                    //判断有没有到生日,没到就减1
                    return age <= 0 ? monthDiff + "月" : age + "岁";
                }
            }
        },
        data() {
            return {
                type: this.$route.params.type,
                titleName: '选择病人',
                patientList: [
                    {
                        "addr": "广东东莞",
                        "allergry": "",
                        "birth": "2019-04-28 13:19:04.0",
                        "cardType": 0,
                        "createBy": "1",
                        "createTime": 1556431640000,
                        "eduLevel": "本科",
                        "email": "abc@163.com",
                        "hisRecored": "",
                        "idcard": "445501198504152314",
                        "isDelete": 0,
                        "nation": "汉族",
                        "patientGender": 1,
                        "patientId": 1,
                        "patientName": "张三",
                        "remark": "",
                        "tel": "13800138001",
                        "versions": 0
                    },
                ]
            }
        },
        created() {
            this.getData();
        },
        methods: {
            getData(val) {
                //TODO:后续获取搜索框的传递回来的值
                console.log("receive children's value : " + val);
                let name = val, tel = val;

                if (/^1(3|4|5|7|8)\d{9}$/.test(val)) {
                    name = "";
                } else {
                    tel = "";
                }

                this.API.GET(this.ApiUrl.GET_PATIENTS, {
                    params: {
                        name: name,
                    }
                }).then(({data}) => {
                    console.log("病人列表------", data);
                    if (data.code === 1200) {
                        this.patientList = data.data.list;
                    }
                }).catch(err => {
                    console.log("getPatients::err------", err);
                });
            },
            goToRecord(patient) {
                this.$store.state.patient = patient;
                this.$router.push({name: 'record'});
            }
        }
    }

</script>

<style scoped>
    .patient {
        min-height: 40px;
        border-bottom: 1px solid #ccc;
        background-color: white;
    }

    .patientlist {
        background-color: #e6e6e6;
    }

</style>